import { max } from "lodash-es";

// 自定义tooltip格式化函数（优化版）
const createTooltipFormatter = (chartType, tooltipData) => {
  return (params) => {
    if (!params || params.length === 0) return '';

    const time = params[0].axisValue;
    const timeData = tooltipData[time];

    if (!timeData) return `${time}<br/>暂无数据`;

    let result = `${time}<br/>`;

    // 获取电压值
    const maxVoltage = timeData.max?.value || 0;
    const minVoltage = timeData.min?.value || 0;
    const voltageDiff = Math.abs(maxVoltage - minVoltage);

    // 基础电压信息
    if (chartType === 1) {
      result += `<span style="color: #FFA500;">●</span> 最高电压: ${maxVoltage.toFixed(1)}mV<br/>`;
      result += `<span style="color: #00BFFF;">●</span> 最低电压: ${minVoltage.toFixed(1)}mV<br/>`;
      result += `<span style="color: #ec7f8c;">●</span> 最大压差: ${voltageDiff.toFixed(1)}mV<br/>`;
    }

    // 根据维度显示额外信息
    if (chartType === 2) {
      // 电池堆维度：显示所在簇
      if (timeData.max?.blockName) {
        result += `<span style="color: #FFA500;">●</span> 最高电压: ${maxVoltage.toFixed(1)}mV<br/>`;
        result += `<span style="color: #FFA500;">●</span> 最高电压所在簇:${timeData.max.linkName}-${timeData.max.blockName}<br/>`;
      }
      if (timeData.min?.blockName) {
        result += `<span style="color: #00BFFF;">●</span> 最低电压: ${minVoltage.toFixed(1)}mV<br/>`;
        result += `<span style="color: #00BFFF;">●</span> 最低电压所在簇:${timeData.max.linkName}-${timeData.min.blockName}<br/>`;
      }
    } else if (chartType === 3) {
      // 电站维度：显示所在堆和所在簇
      if (timeData.max?.linkName || timeData.max?.blockName) {
        result += `<span style="color: #FFA500;">●</span> 最高电压: ${maxVoltage.toFixed(1)}mV<br/>`;
        result += `<span style="color: #FFA500;">●</span> 最高电压所在簇:${timeData.max.linkName}-${timeData.max.blockName}<br/>`;
      }
      if (timeData.min?.linkName || timeData.min?.blockName) {
        result += `<span style="color: #00BFFF;">●</span> 最低电压: ${minVoltage.toFixed(1)}mV<br/>`;
        result += `<span style="color: #00BFFF;">●</span> 最低电压所在簇:${timeData.min.linkName}-${timeData.min.blockName}<br/>`;
      }
    }

    return result.replace(/<br\/>$/, ''); // 移除最后的换行
  };
};

// 双图表配置 - 电压分布统计（优化版）
export const getVoltageDistributionOption = (chartType = 1, tooltipData = {}) => {
  // 生成24小时的时间轴数据 (0:00 到 23:59)
  const generateTimeData = () => {
    const timeData = [];
    for (let hour = 0; hour < 24; hour++) {
      for (let minute = 0; minute < 60; minute += 1) { // 每1分钟一个点
        const timeStr = `${hour.toString().padStart(2, '0')}:${minute.toString().padStart(2, '0')}`;
        timeData.push(timeStr);
      }
    }
    return timeData;
  };

  const timeAxisData = generateTimeData();

  return {
    title: {
      text: '电压分布统计',
      textStyle: {
        fontSize: 16,
        color: '#fff'
      },
      left: 'center',
      top: 10,
    },
    tooltip: {
      trigger: 'axis',
      formatter: createTooltipFormatter(chartType, tooltipData),
      backgroundColor: "rgba(13, 20, 41, 0.9)",
      borderColor: "rgba(8, 146 ,164, 0.5)",
      borderWidth: 1,
      padding: [10, 15],
      textStyle: {
        color: '#fff',
        fontSize: 14
      }
    },
    legend: {
      textStyle: {
        color: '#fff'
      },
      top: '40',
      data: ['最高电压', '最低电压', '电压差值'],
    },
    axisPointer: { link: [{ xAxisIndex: "all" }] },
    grid: [
      {
        left: 60,
        right: '3%',
        top: 80,
        height: '35%'
      },
      {
        left: 60,
        right: '3%',
        top: '320',
        height: '25%'
      }
    ],
    xAxis: [{
      type: 'category',
      data: timeAxisData,
      boundaryGap: false,
      axisLine: { onZero: true },
      axisLine: {
        lineStyle: {
          color: '#fff'
        }
      }
    }, {
      type: 'category',
      gridIndex: 1,
      data: timeAxisData,
      boundaryGap: false,
      axisLine: { onZero: true },
      axisLine: {
        lineStyle: {
          color: '#fff'
        }
      }
    }],
    yAxis: [
      {
        type: 'value',
        name: '电压(mV)',
        splitNumber: 5,
        nameTextStyle: {
          color: '#fff'
        },
        axisLabel: {
          color: '#fff'
        },
        axisLine: {
          lineStyle: {
            color: '#fff'
          }
        },
        splitLine: {
          lineStyle: {
            color: 'rgba(255,255,255,0.1)'
          }
        }
      },
      {
        type: 'value',
        gridIndex: 1,
        name: '电压(mV)',
        splitNumber: 5,
        nameTextStyle: {
          color: '#fff'
        },
        axisLabel: {
          color: '#fff'
        },
        axisLine: {
          lineStyle: {
            color: '#fff'
          }
        },
        splitLine: {
          lineStyle: {
            color: 'rgba(255,255,255,0.1)'
          }
        }
      }
    ],
    dataZoom: [
      {
        type: 'slider',
        show: true,
        xAxisIndex: [0],
        start: 0,
        end: 100,
        height: 20,
        bottom: 10,
        borderColor: '#ccc',
        fillerColor: 'rgba(167,183,204,0.4)',
        handleColor: '#fff',
        handleSize: '100%',
        textStyle: {
          color: '#fff'
        }
      },
      {
        type: 'inside',
        xAxisIndex: [0],
        start: 0,
        end: 20
      }
    ],
    series: [
      {
        name: '最高电压',
        type: 'line',
        data: [],
        itemStyle: {
          color: '#FFA500'
        },
        lineStyle: {
          color: '#FFA500',
          width: 2
        },
        symbol: 'none',
        smooth: false,
        showSymbol: false,
      },
      {
        name: '最低电压',
        type: 'line',
        data: [],
        itemStyle: {
          color: '#00BFFF'
        },
        lineStyle: {
          color: '#00BFFF',
          width: 2
        },
        symbol: 'none',
        smooth: true,
        showSymbol: false,
      },
      {
        name: '电压差值',
        type: 'line',
        xAxisIndex: 1,
        yAxisIndex: 1,
        data: [],
        itemStyle: {
          color: '#ec7f8c'
        },
        lineStyle: {
          color: '#ec7f8c',
          width: 2
        },
        symbol: 'none',
        smooth: false,
        showSymbol: false,
      }
    ]
  };
};